import 'package:flutter/material.dart';
import 'package:flutter_saixiaoli/utils/dialog.dart';
import 'package:roundcheckbox/roundcheckbox.dart';

class FaceRes extends StatefulWidget {
  @override
  State<FaceRes> createState() => _FaceResState();
}

class _FaceResState extends State<FaceRes> {
  bool editShow = false;
  //dialog内容
  Widget dialogWidget() {
    return Container(
      height: 100,
      child: Column(
        children: [
          Container(
            width: 223,
            height: 44,
            alignment: Alignment.center,
            margin: EdgeInsets.only(top: 20),
            padding: EdgeInsets.symmetric(vertical: 10),
            decoration: BoxDecoration(
                border: Border.all(color: Color.fromRGBO(221, 221, 221, 1)),
                borderRadius: BorderRadius.circular(2)),
            child: TextField(
              decoration:
                  InputDecoration(border: InputBorder.none, isCollapsed: true),
            ),
          ),
          Container(
            margin: EdgeInsets.only(top: 15),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Container(
                  child: Text(
                    '*',
                    style: TextStyle(
                        color: Color.fromRGBO(191, 55, 54, 1), fontSize: 12),
                  ),
                ),
                Container(
                  child: Text('填写参赛号来搜索您的照片~',
                      style: TextStyle(
                          color: Color.fromRGBO(153, 153, 153, 1),
                          fontSize: 12)),
                )
              ],
            ),
          )
        ],
      ),
    );
  }

  String dialogTitle = '添加参数号';
  bool closeBtn = true;
  double circular = 5;
  bool checked = false;
  @override
  Widget build(BuildContext context) {
    //底部按钮
    List<Widget> actions = [
      Container(
        width: MediaQuery.of(context).size.width,
        margin: EdgeInsets.only(bottom: 10),
        alignment: Alignment.center,
        child: SizedBox(
          child: ElevatedButton(
            onPressed: () {},
            child: Text(
              '确定',
              style: TextStyle(color: Colors.white),
            ),
          ),
          width: 150,
          height: 44,
        ),
      )
    ];
    return Scaffold(
      appBar: AppBar(
        title: Text('识别结果'),
        elevation: 0,
        centerTitle: true,
      ),
      body: Column(
        children: [
          Container(
            height: 30,
            color: Color.fromRGBO(251, 243, 243, 1),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Container(
                  child: Text(
                    '共为您找到',
                    style: TextStyle(
                        color: Color.fromRGBO(102, 102, 102, 1), fontSize: 11),
                  ),
                ),
                Container(
                  child: Text(
                    '0',
                    style:
                        TextStyle(color: Colors.red, fontSize: 11, height: 1.5),
                  ),
                ),
                Container(
                  child: Text(
                    '张图片',
                    style: TextStyle(
                        color: Color.fromRGBO(102, 102, 102, 1), fontSize: 11),
                  ),
                )
              ],
            ),
          ),
          Container(
            height: 60,
            decoration: BoxDecoration(color: Colors.white, boxShadow: [
              BoxShadow(
                  color: Color.fromRGBO(202, 202, 202, 0.35),
                  offset: Offset(0.0, 5),
                  blurRadius: 15,
                  spreadRadius: 1.0)
            ]),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Container(
                  child: Text(
                    '您可以去尝试一下参赛号选手',
                    style: TextStyle(fontSize: 12),
                  ),
                ),
                Container(
                  margin: EdgeInsets.only(left: 15),
                  child: Material(
                    color: Color.fromRGBO(191, 55, 54, 1),
                    borderRadius: BorderRadius.circular(12.5),
                    child: InkWell(
                      borderRadius: BorderRadius.circular(12.5),
                      onTap: () {
                        Showdialog.show(context,
                            title: dialogTitle,
                            content: dialogWidget(),
                            actions: actions,
                            circular: circular);
                      },
                      child: Container(
                        //margin: EdgeInsets.only(left: 20),
                        alignment: Alignment.center,
                        width: 80,
                        height: 25,
                        child: Text(
                          '参赛号搜索',
                          style: TextStyle(
                              color: Colors.white, fontSize: 11, height: 1),
                        ),
                      ),
                    ),
                  ),
                ),
                Container(
                  margin: EdgeInsets.only(left: 10),
                  child: Material(
                    color: Color.fromRGBO(191, 55, 54, 1),
                    borderRadius: BorderRadius.circular(12.5),
                    child: InkWell(
                      onTap: () {
                        setState(() {
                          editShow = !editShow;
                        });
                      },
                      borderRadius: BorderRadius.circular(12.5),
                      child: Container(
                        // margin: EdgeInsets.only(left: 10),
                        alignment: Alignment.center,
                        width: 80,
                        height: 25,
                        // decoration: BoxDecoration(
                        //     borderRadius: BorderRadius.circular(12.5),
                        //     color: Color.fromRGBO(191, 55, 54, 1)),
                        child: Text(
                          '批量操作',
                          style: TextStyle(
                              color: Colors.white, fontSize: 11, height: 1.0),
                        ),
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ),
          Expanded(
            child: Container(
              padding: EdgeInsets.symmetric(horizontal: 10),
              child: GridView.count(
                crossAxisCount: 2,
                crossAxisSpacing: 10,
                shrinkWrap: true,
                children: [
                  Container(
                    color: Colors.red,
                    alignment: Alignment.topRight,
                    padding: EdgeInsets.only(top: 10, right: 10),
                    child: editShow
                        ? SizedBox(
                            width: 20,
                            height: 20,
                            child: RoundCheckBox(
                              size: 20,
                              onTap: (select) {
                                setState(() {
                                  checked = select;
                                });
                              },
                              checkedColor: Color.fromRGBO(191, 55, 54, 1),
                              isChecked: checked,
                              uncheckedColor:
                                  Color.fromRGBO(255, 255, 255, 0.5),
                              checkedWidget: const Icon(
                                Icons.check,
                                color: Colors.white,
                                size: 15,
                              ),
                            ),
                          )
                        : Container(),
                  ),
                  Container(
                    color: Colors.green,
                  ),
                  Container(
                    color: Colors.black,
                  ),
                  Container(
                    color: Colors.blue,
                  ),
                  Container(
                    color: Colors.red,
                  ),
                  Container(
                    color: Colors.green,
                  ),
                  Container(
                    color: Colors.black,
                  ),
                  Container(
                    color: Colors.blue,
                  )
                ],
              ),
            ),
          ),
          if (editShow)
            Container(
              height: 50,
              child: Row(
                children: [
                  Container(
                    width: MediaQuery.of(context).size.width * 0.5,
                    padding: EdgeInsets.only(left: 12),
                    child: Row(
                      children: [
                        RoundCheckBox(
                          size: 20,
                          onTap: (select) {
                            setState(() {
                              checked = select;
                            });
                          },
                          checkedColor: Color.fromRGBO(191, 55, 54, 1),
                          isChecked: checked,
                          uncheckedColor: Color.fromRGBO(255, 255, 255, 0.5),
                          checkedWidget: const Icon(
                            Icons.check,
                            color: Colors.white,
                            size: 15,
                          ),
                        ),
                        Container(
                          margin: EdgeInsets.only(left: 5),
                          child: Text(
                            '全选',
                            style: TextStyle(fontSize: 12),
                          ),
                        )
                      ],
                    ),
                  ),
                  Container(
                    width: MediaQuery.of(context).size.width * 0.5,
                    color: Color.fromRGBO(191, 55, 54, 1),
                    child: Center(
                      child: Text(
                        '保存至相册（68张）',
                        style: TextStyle(color: Colors.white, fontSize: 15),
                      ),
                    ),
                  )
                ],
              ),
            )
          // Container(
          //   margin: EdgeInsets.only(top: 80),
          //   child: Column(
          //     children: [
          //       Container(
          //         child: Image.asset(
          //           'images/nodata.png',
          //           width: 250,
          //           height: 150,
          //           fit: BoxFit.cover,
          //         ),
          //       ),
          //       Container(
          //         margin: EdgeInsets.only(top: 20),
          //         child: Text(
          //           '暂未识别出照片',
          //           style: TextStyle(
          //               fontSize: 12, color: Color.fromRGBO(153, 153, 153, 1)),
          //         ),
          //       )
          //     ],
          //   ),
          // )
        ],
      ),
    );
  }
}
